import React, { Component } from 'react';
import PropTypes from 'prop-types'
class Xiaoitem extends Component {

  constructor(props){
    super(props)
    this.handleClick=this.handleClick.bind(this)
  }
  shouldComponentUpdate(nextProps,nextState){ //返回一个布尔值
		if(nextProps.content !== this.props.content){
			return true
		}else{
				return false
		}
  }
  render() {
    console.log('zi---开始挂载渲染.......')
    return (
      <li
      onClick={this.handleClick}
      >{this.props.avname}为您服务-{this.props.content}</li>
    );
  }
  handleClick(){
    console.log("this.props.index",this.props.index)
    this.props.deleteItem(this.props.index)
    
  }
}

// 一个对象可以是几种类型中的任意一个类型
// https://zh-hans.reactjs.org/docs/typechecking-with-proptypes.html#___gatsby
// optionalUnion: PropTypes.oneOfType([
//   PropTypes.string,
//   PropTypes.number,
//   PropTypes.instanceOf(Message)
// ]),

Xiaoitem.propTypes={//类型校验
  avname:PropTypes.string.isRequired,
	content:PropTypes.string,
  index:PropTypes.number,
  deleteItem:PropTypes.func
	
}

Xiaoitem.defaultProps={//默认值
  avname:'song-dao'
}

export default Xiaoitem;
